import {fileURLToPath, URL} from 'node:url'

import {defineConfig, loadEnv} from 'vite'
import vue from '@vitejs/plugin-vue'
// import basicSsl from '@vitejs/plugin-basic-ssl'
import vueJsx from '@vitejs/plugin-vue-jsx'
import Unocss from 'unocss/vite'

import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import {ElementPlusResolver} from 'unplugin-vue-components/resolvers'

// https://vitejs.dev/config/
/**
 * options的值 示例： { mode: 'production', command: 'build', ssrBuild: false }
 */
export default defineConfig(function (options) {
  const { mode, command } = options
  /**
   * 从 .env 文件中 统一获取配置文件
   * env {
   *   VITE_APP_CONTEXT: 'csjzzav',
   *   VITE_APP_ASSETS: 'static',
   *   VITE_APP_SERVICE: 'csjzzav',
   *   VITE_APP_SERVICE_PREFIX: '',
   *   VITE_APP_PROXY_MODE: 'dev',
   *   VITE_PROXY: 'http://localhost:21786/'
   * }
   * @type {Record<string, string>}
   */
  const env = loadEnv(mode, process.cwd())
  return {
    /**
     * 在生产中服务时的基本公共路径。
     * @default '/'
     */
    // root: process.cwd(), // 项目根目录（index.html 文件所在的位置）,
    base: './', // 开发或生产环境服务的公共基础路径 配置引入相对路径
    // base: `/${env.VITE_APP_CONTEXT}/`,
    // base:  options.mode === 'development'? './' : './csjzzav', // 默认是 '/'
    // mode: 'development', // 模式
    // publicDir: 'public', // 静态资源服务的文件夹
    // cacheDir: 'node_modules/.vite', // 存储缓存文件的目录
    // envDir: 'root', // 用于加载 .env 文件的目录。可以是一个绝对路径，也可以是相对于项目根的路径。
    // envPrefix: 'VITE_', // 以 envPrefix 开头的环境变量会通过 import.meta.env 暴露在你的客户端源码中

    resolve: {
      alias: {
        '@': fileURLToPath(new URL('./src', import.meta.url)),
        'client-container': fileURLToPath(new URL('./node_modules/client-container/index.js', import.meta.url))
      },
      /*
        引入文件的后缀名称，可以省略
        如果出现同名，按照数组加载的优先顺序
        */
      extensions: ['.mjs', '.js', '.ts', '.jsx', '.tsx', '.json', '.vue', '.d.ts'],
    },
    // 服务配置
    server: {
      host: '0.0.0.0', // //使用IP能访问本机
      // port: 3333, // 端口号
      open: true, // 自动在浏览器打开
      // https: true, // 启用 TLS + HTTP/2
      //设为 true 时若端口已被占用则会直接退出，而不是尝试下一个可用端口
      strictPort: false,
      fs: {
        // 可以为项目根目录的上一级提供服务
        allow: ['..'],
      },
      proxy: {
        // '^/csjzzav/': {
        //   target: 'http://localhost:21786/',
        //   changeOrigin: true,
        // },
        [`^/${env.VITE_APP_SERVICE}/`]: {
          target: `${env.VITE_PROXY}`,
          changeOrigin: true
        },
        // [`^/${env.VITE_APP_SERVICE}/${env.VITE_APP_SERVICE_PREFIX}/`]: {
        //   target: `${env.VITE_PROXY}`,
        //   changeOrigin: true
        // },
        // // 带选项写法：http://localhost:5173/api/bar -> http://jsonplaceholder.typicode.com/bar
        // '/api': {
        //   target: 'http://jsonplaceholder.typicode.com',
        //   changeOrigin: true,
        //   rewrite: (path) => path.replace(/^\/api/, ''),
        // },
      },
    },
    // css 处理
    css: {
      preprocessorOptions: {
        scss: {
          // 全局添加scss
          // additionalData: `@use '@/assets/css/global.scss' as *;`,
          /* .scss全局预定义变量，引入多个文件 以;(分号分割)*/
          // additionalData: `@import "@/assets/css/global.scss";`,
        },
      },
      // 可以查看 CSS 的源码
      devSourcemap: true,
    },
    //  生产环境
    build: {
      // 指定输出文件路径
      outDir: 'dist',
      //指定资源输出路径，相对于 outDir 目录
      assetsDir: './static', // 这个会被  rollupOptions.output.chunkFileNames 等 的配置覆盖
      /*
      启用/禁用 CSS 代码拆分。当启用时，在异步 chunk 中导入的 CSS 将内联到异步 chunk 本身，并在其被加载时一并获取。
      如果禁用，整个项目中的所有 CSS 将被提取到一个 CSS 文件中。
      */
      cssCodeSplit: true,
      sourcemap: false, // 构建后是否生成 source map 文件。如果为 true，将会创建一个独立的 source map 文件。
      copyPublicDir: true, //Vite 会在构建阶段将 publicDir 目录中的所有文件复制到 outDir 目录中。
      minify: 'terser', // 必须启用：terserOptions配置才会有效
      // 代码压缩配置
      terserOptions: { // 需要安装 yarn add terser
        // 生产环境移除console
        compress: {
          drop_console: false, // 生产环境时移除console.log调试代码
          drop_debugger: true,
        },
      },
      rollupOptions: {
        input: 'index.html',
        output: {
          // 静态资源打包做处理
          chunkFileNames: 'static/js/[name]-[hash].js',
          entryFileNames: 'static/js/[name]-[hash].js',
          assetFileNames: 'static/[ext]/[name]-[hash].[ext]',
        },
      },
    },
    plugins: [
      vue(),
      Unocss(),
      // basicSsl(),
      vueJsx(),
      // // 增加下面的配置项,这样在运行时就能检查eslint规范
      // eslintPlugin({
      //   include: ['src/**/*.js', 'src/**/*.vue', 'src/*.js', 'src/*.vue']
      // }),
      AutoImport({
        imports: ["vue", "vue-router"], // 自动导入vue和vue-router相关函数
        dts: "src/auto-import.d.ts", // 生成 `auto-import.d.ts` 全局声明
        resolvers: [ElementPlusResolver()],
      }),
      Components({
        resolvers: [ElementPlusResolver()],
      }),
    ],
  }
})
